<template>
    <div>
        <div id="entrustNum" style="height: 350px;border-radius: 10px;"></div>
    </div>
</template>
<script>
export default{
    data(){
        return{
            lineAry:[],
            circleAry:[],
        }
    },
    created(){
    //    this.getData(); 
    this.showEcharts();
    },
    methods:{
        // getData(){
        //     provincialStatistics().then(res =>{
        //         this.mapData = res.data;
        //         this.showEcharts();
        //     });
        // },
        showEcharts(){
            this.$nextTick(() => {
                var echarts = require('echarts')
                let myCharts = echarts.init(document.getElementById("entrustNum"));
                const echartsOpt = {
                    title: {
                    text: '各分公司处置情况统计',
                    x: 'center',
                    },
                    legend: {
                    data: ['总量', '占比'],
                    right: '10%',
                    },
                    tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        label: {
                        backgroundColor: '#6a7985',
                        },
                    },
                    formatter: (params) => {
                        let result = `${params[0].name}<br>`;
                        params.forEach((item) => {
                        if (item.value) {
                            if (item.seriesName === '占比') {
                            result += `${item.marker} ${item.seriesName} : ${item.value} %</br>`;
                            } else {
                            result += `${item.marker} ${item.seriesName} : ${totalFormat(item.value)}</br>`;
                            }
                        } else {
                            result += `${item.marker} ${item.seriesName} :  - </br>`;
                        }
                        });
                        return result;
                    },

                    },
                    grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '4%',
                    containLabel: true,
                    },
                    xAxis: [
                    {
                        type: 'category',
                        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
                    },
                    ],
                    yAxis: [
                    {
                        type: 'value',
                        name: '总量',
                    },
                    {
                        type: 'value',
                        name: '占比',
                        alignTicks: true,
                        axisLabel: {
                        formatter: '{value} %',
                        },
                    },
                    ],
                    series: [
                    {
                        name: '总量',
                        type: 'bar',
                        barWidth: '50%',
                        data: [4324234,4563214,9012834,2739002,3901233,5319834,3783344],
                    },
                    {
                        name: '占比',
                        type: 'line',
                        yAxisIndex: 1,
                        data: [40,45,90,35,40,50,35],
                    },
                    ],
                }; 
                myCharts.setOption(echartsOpt);   
            });
               
        },
        findOption(val){
            for (var i = 0; i < this.mapData.length; i++) {
                if (this.mapData[i].shortname === val) {
                    return this.mapData[i];
                }
            }
        }
    }
}
</script>